
<template>
    <Header></Header>
    <el-row class="mian">
        <el-col :span="4" class="navigation">
            <div class="grid-content ">
                <Navigation></Navigation>
            </div>
        </el-col>
        <el-col :span="20" class="content">
            <div class="grid-content "><RouterView></RouterView></div>
        </el-col>
    </el-row>
</template>
  
<script lang="ts" setup  name="App">
import Header from "@/components/Header.vue";
import Navigation from "@/components/Navigation.vue";
import { RouterView, RouterLink } from "vue-router";
</script>
<style scoped>
.mian {
    background-color: rgb(240, 242, 248);
    border-radius: 10px;
    height: 500px;
}

.navigation {
    border-radius: 10px;
    background-color: azure;
}

.content {
    background-color: rgb(239, 225, 225);
    border-radius: 10px;
}
</style>